// /**
// //  * Magento
//  *
//  * NOTICE OF LICENSE
//  *
//  * This source file is subject to the Academic Free License (AFL 3.0)
//  * that is bundled with this package in the file LICENSE_AFL.txt.
//  * It is also available through the world-wide-web at this URL:
//  * http://opensource.org/licenses/afl-3.0.php
//  * If you did not receive a copy of the license and are unable to
//  * obtain it through the world-wide-web, please send an email
//  * to license@magentocommerce.com so we can send you a copy immediately.
//  *
//  * DISCLAIMER
//  *
//  * Do not edit or add to this file if you wish to upgrade Magento to newer
//  * versions in the future. If you wish to customize Magento for your
//  * needs please refer to http://www.magentocommerce.com for more information.
//  *
//  * @category    design
//  * @copyright   Copyright (c) 2014 X.commerce, Inc. (http://www.magentocommerce.com)
//  * @license     http://opensource.org/licenses/afl-3.0.php  Academic Free License (AFL 3.0)
//  */

.message(@_message-type: info) {
    @_message-background: "message-@{_message-type}-background";
    @_message-border-color: "message-@{_message-type}-border-color";
    @_message-color: "message-@{_message-type}-color";
    @_message-link-color: "message-@{_message-type}-link-color";
    @_message-link-color-hover: "message-@{_message-type}-link-color-hover";
    @_message-link-color-active: "message-@{_message-type}-link-color-active";
    @_message-icon-top: "message-@{_message-type}-icon-top";
    @_message-icon-right: "message-@{_message-type}-icon-right";
    @_message-icon-bottom: "message-@{_message-type}-icon-bottom";
    @_message-icon-left: "message-@{_message-type}-icon-left";
    ._message();
    ._message-style(
        @_message-color: @@_message-color,
        @_message-background: @@_message-background,
        @_message-link-color: @@_message-link-color,
        @_message-link-color-hover: @@_message-link-color-hover,
        @_message-link-color-active: @@_message-link-color-active,
        @_message-border-color: @@_message-border-color
    );
}

._message(
    @_message-padding: @message-padding,
    @_message-margin: @message-margin,
    @_message-border-radius: @message-border-radius
) {
    display: block;
    .css(margin, @_message-margin);
    .css(padding, @_message-padding);
    .css(border-radius, @_message-border-radius);
    .typography(
        @_color: @message-color,
        @_font-size: @message-font-size,
        @_font-family: @message-font-family,
        @_font-weight: @message-font-weight,
        @_font-style: @message-font-style,
        @_line-height: @message-line-height
    );
    ._message-border(@message-border-width, @message-border-style);
}

._message-style(
    @_message-background: @message-info-background,
    @_message-color: @message-info-color,
    @_message-link-color: @message-info-link-color,
    @_message-link-color-hover: @message-info-link-color-hover,
    @_message-link-color-active: @message-info-link-color-active,
    @_message-border-color: @message-info-border-color
) {
    .css(background, @_message-background);
    .css(border-color, @_message-border-color);
    .css(color, @_message-color);
    a {
        .css(color, @_message-link-color);
        &:hover {
            .css(color, @_message-link-color-hover);
        }
        &:active {
            .css(color, @_message-link-color-active);
        }
    }
}

._message-border(
    @_message-border-width: @message-border-width,
    @_message-border-style: @message-border-style
) when not (@_message-border-width = 0)
and not (@_message-border-width = false)
and not (@_message-border-style = false) {
    .css(border, @_message-border-width @_message-border-style);
}

// Messages with lateral icon

.message-icon-lateral(@_message-type: info, @_message-position: right) {
    .message(@_message-type);
    @_message-icon-position: @_message-position;
    @_message-icon: "message-@{_message-type}-icon";
    @_message-icon-color: "message-@{_message-type}-icon-color-lateral";
    @_message-icon-background: "message-@{_message-type}-icon-background";
    @_message-icon-top: "message-@{_message-type}-icon-top";
    @_message-icon-right: "message-@{_message-type}-icon-right";
    @_message-icon-bottom: "message-@{_message-type}-icon-bottom";
    @_message-icon-left: "message-@{_message-type}-icon-left";
    ._message-icon-lateral(
        @_message-icon-position,
        @@_message-icon,
        @@_message-icon-color,
        @@_message-icon-background,
        @@_message-icon-top,
        @@_message-icon-left,
        @@_message-icon-bottom,
        @@_message-icon-right
    );
}

// Messages with inner icon

.message-icon-inner(@_message-type: info) {
    .message(@_message-type);
    @_message-icon: "message-@{_message-type}-icon";
    @_message-icon-color: "message-@{_message-type}-icon-color-inner";
    @_message-icon-background: "message-@{_message-type}-icon-background";
    @_message-icon-top: "message-@{_message-type}-icon-top";
    @_message-icon-right: "message-@{_message-type}-icon-right";
    @_message-icon-bottom: "message-@{_message-type}-icon-bottom";
    @_message-icon-left: "message-@{_message-type}-icon-left";
    ._message-icon-inner(
        @@_message-icon,
        @@_message-icon-color,
        @@_message-icon-background,
        @@_message-icon-top,
        @@_message-icon-left,
        @@_message-icon-bottom,
        @@_message-icon-right
    );
}

// Private mixins
._message-icon-lateral(
    @_message-icon-position,
    @_message-icon,
    @_message-icon-color,
    @_message-icon-background,
    @_message-icon-top,
    @_message-icon-left,
    @_message-icon-bottom,
    @_message-icon-right
) {
    position: relative;
    &:before {
        content: '';
        position: absolute;
        .css(width, @message-icon-lateral-width);
        text-align: center;
        top: 0;
        height: 100%;
        display: block;
        padding: 0;
        .css(background, @_message-icon-background);
    }
    > *:first-child:before {
        content: '';
        position: absolute;
        overflow: hidden;
        top: 50%;
        .css(margin-top, -@message-icon-lateral-arrow-size);
    }
    > *:first-child:after {
        ._icon-font(
            @_icon-font-content: @_message-icon,
            @_icon-font: @icon-font,
            @_icon-font-size: @message-icon-font-size,
            @_icon-font-line-height: @message-icon-font-line-height,
            @_icon-font-color: @_message-icon-color,
            @_icon-font-margin: -@message-icon-font-size/2 0 0,
            @_icon-font-vertical-align: @icon-font-vertical-align
        );
        position: absolute;
        .css(top, @_message-icon-top);
        .css(right, @_message-icon-right);
        .css(bottom, @_message-icon-bottom);
        .css(left, @_message-icon-left);
        text-align: center;
        .css(width, @message-icon-lateral-width);
    }
    ._message-icon-lateral-position(
        @_message-icon-position,
        @_message-icon-background
    );
}

._message-icon-lateral-position(
    @_message-icon-position,
    @_message-icon-background
) when (@_message-icon-position = right) {
    .css(padding-right, @message-icon-lateral-width + @indent-s-base);
    &:before {
        right: 0;
        ._message-icon-lateral-border-radius(@_message-icon-position);
    }
    > *:first-child:before {
        .arrow(left, @message-icon-lateral-arrow-size, @_message-icon-background);
        .css(right, @message-icon-lateral-width);
    }
    > *:first-child:after {
        right: 0;
    }
}

._message-icon-lateral-position(
    @_message-icon-position,
    @_message-icon-background
) when (@_message-icon-position = left) {
    .css(padding-left, @message-icon-lateral-width + @indent-s-base);
    &:before {
        left: 0;
        ._message-icon-lateral-border-radius(@_message-icon-position);
    }
    > *:first-child:before {
        .arrow(right, @message-icon-lateral-arrow-size, @_message-icon-background);
        .css(left, @message-icon-lateral-width);
    }
    > *:first-child:after {
        left: 0;
    }
}

._message-icon-lateral-border-radius(
    @_message-icon-position
) when (@_message-icon-position = left) and not (@message-border-radius = false) and not (@message-border-width = false) {
    border-radius: (@message-border-radius - @message-border-width) 0 0 (@message-border-radius - @message-border-width);
}

._message-icon-lateral-border-radius(
    @_message-icon-position
) when (@_message-icon-position = right) and not (@message-border-radius = false) and not (@message-border-width = false) {
    border-radius: 0 (@message-border-radius - @message-border-width) (@message-border-radius - @message-border-width) 0;
}

._message-icon-inner(
    @_message-icon,
    @_message-icon-color,
    @_message-icon-background,
    @_message-icon-top,
    @_message-icon-left,
    @_message-icon-bottom,
    @_message-icon-right
) {
    position: relative;
    .css(padding-left, @message-icon-inner-padding-left);
    > *:first-child:before {
        ._icon-font(
            @_icon-font-content: @_message-icon,
            @_icon-font: @icon-font,
            @_icon-font-size: @message-icon-font-size,
            @_icon-font-line-height: @message-icon-font-line-height,
            @_icon-font-color: @_message-icon-color,
            @_icon-font-margin: -@message-icon-font-size/2 0 0,
            @_icon-font-vertical-align: @icon-font-vertical-align
        );
        position: absolute;
        .css(top, @_message-icon-top);
        .css(right, @_message-icon-right);
        .css(bottom, @_message-icon-bottom);
        .css(left, @_message-icon-left);
        text-align: center;
        .css(width, @message-icon-inner-padding-left);
    }
}
